<template>
  <div>
    <el-form ref="form" v-loading="loading" :model="form" label-width="140px">
      <el-collapse v-model="activeNames" @change="handleChange">
        <el-collapse-item title="设置跟进时限" name="2">
          <div style="display: flex;">
            <el-form-item
              label="首次跟进时限(h)"
              label-width="150px"
              :rules="[
                { required: true, message: '不能为空'}
              ]"
            >
              <el-col :span="4">
                <el-input-number
                  v-model="form.first_follow_limit.paramValue"
                  @change="sChange"
                  controls-position="right"
                  :min="0"
                ></el-input-number>
              </el-col>
            </el-form-item>
            <el-form-item label="待定跟进时限(h)" label-width="150px">
              <el-col :span="4">
                <el-input-number
                  v-model="form.unknown_follow_limit.paramValue"
                  @change="sChange"
                  controls-position="right"
                  :min="0"
                ></el-input-number>
              </el-col>
            </el-form-item>
          </div>
        </el-collapse-item>
        <el-collapse-item title="无效/战败自动审批" name="5">
          <el-form-item label="超时自动审核">
            <el-col :span="4">
              <el-input-number
                v-model="form.clue_auto_audit.paramValue"
                @change="sChange"
                controls-position="right"
                :min="0"
              ></el-input-number>
            </el-col>
            <span>h</span>
            <span style="color:#ccc;padding-left:140px">(超过设置的时限为审核的状态自动审核通过。)</span>
          </el-form-item>
        </el-collapse-item>
        <el-collapse-item title="是否强制清洗" name="5">
          <el-form-item>
            <el-col :span="4">
              <el-switch
                is_
                v-model="form.is_switch_value.paramValue"
                @change="sChange"
                active-text="开"
                inactive-text="关"
              ></el-switch>
            </el-col>
          </el-form-item>
        </el-collapse-item>
        <el-collapse-item title="线索类型强制清洗开关" name="5">
          <el-form-item>
            <el-col :span="4">
              普通线索：
              <el-switch
                is_
                v-model="form.is_type_pt_value.paramValue"
                @change="sChange"
                active-text="开"
                inactive-text="关"
              ></el-switch>
            </el-col>
            <el-col :span="4">
               试驾线索：
              <el-switch
                is_
                v-model="form.is_type_sj_value.paramValue"
                @change="sChange"
                active-text="开"
                inactive-text="关"
              ></el-switch>
            </el-col>
            <el-col :span="4">
               订金线索：
              <el-switch
                is_
                v-model="form.is_type_dj_value.paramValue"
                @change="sChange"
                active-text="开"
                inactive-text="关"
              ></el-switch>
            </el-col>
              <el-col :span="4"  v-if="arcfox">
               APP注册线索：
              <el-switch
                is_
                v-model="form.is_type_appzc_value.paramValue"
                @change="sChange"
                active-text="开"
                inactive-text="关"
              ></el-switch>
            </el-col>
          </el-form-item>
        </el-collapse-item>
        <!-- <el-collapse-item title="审批设置" name="3">
          <el-form-item>
            <el-checkbox v-model="form.invalid_audit_param.paramValue" @change="sChange">无效需要审批</el-checkbox>
            <span style="color:#ccc">( 如需无效审批,需要审批通过后,才会变成无效 )</span>
          </el-form-item>
          <el-form-item>
            <el-checkbox v-model="form.lose_audit_param.paramValue" @change="sChange">战败需要审批</el-checkbox>
            <span style="color:#ccc">( 如需战败审批,需要审批通过后,才会变成战败 )</span>
          </el-form-item>
        </el-collapse-item>-->
      </el-collapse>
    </el-form>
    <div slot="footer" v-if="savebtn" align="center" style="padding:10px 20px;">
      <el-button @click="save" type="primary">保 存</el-button>
    </div>
  </div>
</template>
<script>
import { searchDefeatReason } from '@/api/potenCus/basedata/defeatreason';
import { getAppId } from '@/assets/js/auth';
import { searchOnceDriveMileage, saveMileage } from '@/api/potenCus/basedata/onceDriveMileage';
export default {
  name: 'clueParameters',
  data() {
    return {
      activeNames: ['1', '2', '3', '4', '5', '6'],
      // value1: [new Date(2019, 9, 10, 8 ), new Date(2019, 9, 10, 16)],
      options: [],
      arcfox:getAppId()=='arcfox'?true:false,
      value: '',
      options1: [],
      value1: '',
      options2: [],
      value2: '',
      form: {
        clue_down_limit: { paramValue: '' },
        clue_auto_audit: { paramValue: '' },
        first_follow_limit: { paramValue: '' },
        latest_follow_limit: { paramValue: '' },
        unknown_follow_limit: { paramValue: '' },
        need_obey_appoint_time: { paramValue: '' },
        allow_delay_follow: { paramValue: '' },
        lose_model_param: { paramValue: '', status: false },
        lose_city_param: { paramValue: '', status: false },
        lose_dealer_param: { paramValue: '', status: false },
        invalid_audit_param: { paramValue: '' },
        lose_audit_param: { paramValue: '' },
        is_switch_value: { paramValue: false },
        is_type_pt_value: { paramValue: false },
        is_type_sj_value: { paramValue: false },
        is_type_dj_value: { paramValue: false },
        is_type_appzc_value: { paramValue: true },

      },
      page: {
        pageNum: 1,
        currentPage: 1,
        pageSize: 100,
        limit: 20
      },
      savebtn: false,
      switchValue: false,
      loading: false
    };
  },
  created() {
    this.getOptions();
    this.searchInfo();
  },
  methods: {
    handleChange(val) {
      console.log(val);
    },
    sChange() {
      this.savebtn = true;
    },
    changeOptions(index, val) {
      // console.log(index,val);
      let boo = false;
      if (val) {
        boo = true;
      }
      switch (index) {
        case 0:
          this.form.lose_model_param.status = boo;
          break;
        case 1:
          this.form.lose_city_param.status = boo;
          break;
        case 2:
          this.form.lose_dealer_param.status = boo;
          break;
        default:
          break;
      }
      this.savebtn = true;
    },
    changeStatus(index) {
      // console.log(index);
      switch (index) {
        case 0:
          this.form.lose_model_param.paramValue = '';
          break;
        case 1:
          this.form.lose_city_param.paramValue = '';
          break;
        case 2:
          this.form.lose_dealer_param.paramValue = '';
          break;
        default:
          break;
      }
      this.savebtn = true;
    },
    async searchInfo() {
      this.loading = true;
      let res = await searchOnceDriveMileage();
      console.log('参数设置', res.data);
      var list = res.data;
      list.map((item, index) => {
        if (!this.form[item.paramCode]) {
          this.form[item.paramCode] = {};
        }
        if (item.paramValue === '10041001' || item.paramValue === '10041002') {
          this.form[item.paramCode].paramValue = item.paramValue === '10041001' ? true : false;
        } else if (item.paramCode === 'lose_model_param' || item.paramCode === 'lose_city_param' || item.paramCode === 'lose_dealer_param') {
          this.form[item.paramCode].status = item.status === 10041001 ? true : false;
          this.form[item.paramCode].paramValue = item.status === 10041001 ? Number(item.paramValue) : '';
          console.log(this.form[item.paramCode].status);
        } else {
          this.form[item.paramCode].paramValue = item.paramValue;
        }
        this.form[item.paramCode].paramId = item.paramId;
      });
      this.loading = false;
      console.log(this.form);
    },
    async save() {
      let self = this;
      this.$refs['form'].validate(valid => {
        if (valid) {
          this.loading = true;
          // console.log(this.form)
          let arr = [],
            form = this.form;
          Object.keys(form).forEach(function(key) {
            // console.log(key,form[key]);
            // console.log(typeof form[key].paramValue)
            if (typeof form[key].paramValue === 'boolean') {
              form[key].paramValue = form[key].paramValue ? '10041001' : '10041002';
            }
            if (typeof form[key].status === 'boolean') {
              form[key].status = form[key].status ? 10041001 : 10041002;
            }
            arr.push(form[key]);
          });
          console.log(arr);
          saveMileage(arr).then(res => {
            if (res.resultCode === 200) {
              // this.loading = false;
              this.savebtn = false;
              this.searchInfo();
              this.$message.success('保存成功');
              // this.closeDialog('refresh');
            }
          });
        } else {
          this.$message.info('请填写必填项!');
          return false;
        }
      });
    },
    async getOptions() {
      this.options = [];
      this.options1 = [];
      this.options2 = [];
      const res = await searchDefeatReason(this.page);
      // console.log('战败原因' ,res.data.records)
      let arr = [];
      res.data.records.forEach(x => {
        arr.push({
          value: x.defeatReasonId,
          label: x.drDesc
        });
      });
      this.options = this.options1 = this.options2 = arr;
    }
  }
};
</script>
<style lang="" scoped>
</style>
